<template>
	<Tabs>
		<TabPane label="会员等级">
			<Alert show-icon>会员最多可以设置十个等级，开启配置每一个等级的会员权益，用户成为会员后，根据用户的消费、互动等行为来划分等级</Alert>
			<SuperTable
		    	ref="table"
		    	:datas="datas"
		    	:columns="columns"
		    	:params="params"
		    	:pagination="false"
		    	:loading="false"
		    >
		        <div slot-scope="{ row }" slot="action">
		        	<Button v-if="row.status == 1" type="primary" size="small" @click="handleGoEdit(row.id)">配置</Button>
		        	<Button v-else type="success" size="small" @click="handleOpen(row.id, 1)">开启</Button>
	        		<Button v-if="row.status && row.id > 2" type="error" size="small" @click="handleOpen(row.id, 0)">关闭</Button>
		        </div>
		    </SuperTable>
		</TabPane>
	</Tabs>
</template>

<script>
	//path="API_MEMBER_GRADE_LISTS"
import Util from '@/libs/util.js';
import SuperTable from '@/components/SuperTable.vue';
import ImageCell from '@/components/ImageCell/index.vue';
import PoptipTable from '@/components/PoptipTable.vue';
import DrawerForm from '@/components/DrawerForm.vue';
export default {
	name: 'memberGrade',
	components: {
		SuperTable,
		ImageCell,
		PoptipTable,
		DrawerForm,
	},
	data() {
		return {
			params: {
				page: 1,
				limit: 10
			},
			datas: [
				{
					id: 1,
					name: 'VIP1',
					custom_name: '普卡会员',
					growth_value: 0,
					enjoyservice_texts: '购物折扣 95折',
					reward_texts: '',
					is_fee: 1,
					fee_money: '99.00',
					number: 100,
					status: 1
				},
				{
					id: 2,
					name: 'VIP2',
					custom_name: '金卡会员',
					growth_value: 500,
					enjoyservice_texts: '免运费,购物折扣 9折',
					reward_texts: '送券',
					is_fee: 0,
					fee_money: '0.00',
					number: 79,
					status: 1
				},
				{
					id: 3,
					name: 'VIP3',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				},
				{
					id: 4,
					name: 'VIP4',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				},
				{
					id: 5,
					name: 'VIP5',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				},
				{
					id: 6,
					name: 'VIP6',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				},
				{
					id: 7,
					name: 'VIP7',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				},
				{
					id: 8,
					name: 'VIP8',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				},
				{
					id: 9,
					name: 'VIP9',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				},
				{
					id: 10,
					name: 'VIP10',
					custom_name: '',
					growth_value: 0,
					enjoyservice_texts: '',
					reward_texts: '',
					is_fee: 0,
					fee_money: '0.00',
					number: 0,
					status: 0
				}
			],
			columns: [
                {
                    title: '等级名称',
                    key: 'name',
                    render: (h, params) => {
                    	return h('span', {
                    		attrs: {
                    			class: 'ui-text-primary'
                    		}
                    	}, params.row.name);
                    }
                },
                {
                    title: '自定义等级名称',
                    key: 'custom_name',
                    align: 'center',
                    render: (h, params) => {
                    	if(!params.row.status) {
                    		return h('span', '--');
                    	}
                    	return h('span', params.row.custom_name);
                    }
                },
                {
                    title: '成长值要求',
                    key: 'growth_value',
                    align: 'center',
                    render: (h, params) => {
                    	if(!params.row.status) {
                    		return h('span', '--');
                    	}
                    	return h('span', params.row.growth_value);
                    }
                },
                {
                    title: '会员权益',
                    key: 'enjoyservice_texts',
                    render: (h, params) => {
                    	if(!params.row.status) {
                    		return h('span', '--');
                    	}
                    	if(!params.row.enjoyservice_texts) {
                    		return h('span', '无');
                    	}
                    	let texts = params.row.enjoyservice_texts.split(',');
                    	let tags = texts.map(item => {
                    		return h('Tag', item);
                    	})
                    	return h('div', tags);
                    }
                },
                {
                    title: '升级奖励',
                    key: 'reward_texts',
                    align: 'center',
                    render: (h, params) => {
                    	if(!params.row.status) {
                    		return h('span', '--');
                    	}
                    	if(!params.row.reward_texts) {
                    		return h('span', '无');
                    	}
                    	let texts = params.row.reward_texts.split(',');
                    	let tags = texts.map(item => {
                    		return h('Tag', item);
                    	})
                    	return h('div', tags);
                    }
                },
                {
                    title: '付费模式',
                    key: 'fee',
                    align: 'center',
                    render: (h, params) => {
                    	if(!params.row.status) {
                    		return h('span', '--');
                    	}
                    	if(!params.row.is_fee) {
                    		return h('span', '否');
                    	}
                    	return h('span', '是(付费'+ params.row.fee_money +')');
                    }
                },
                {
                    title: '会员人数',
                    key: 'number',
                    align: 'center',
                    render: (h, params) => {
                    	if(!params.row.status) {
                    		return h('span', '--');
                    	}
                    	return h('span', params.row.number);
                    }
                },
                {
                    title: '操作',
                    slot: 'action',
                    align: "center",
                    width: 120
                },
			]
		}
	},
	methods: {
		// 编辑
		handleGoEdit(id) {
			this.$router.push({name: 'user_retail_grade_edit', query: {id: id}});
		},
		// 开启、关闭
		handleOpen(id, status) {
			/*Util.ajax.post(this.API['API_MEMBER_GRADE_DESTROY'], {id: id}).then((res) => {
				this.$Message.success('删除成功');
				this.$refs.table.init();
			}).catch(() => {
				
			})*/
		}
	}
}
</script>